<template>
  <a-card :bordered="false" title="换极提醒">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24" style="height: 54px">
          <a-col :md="12" :sm="24">
            <a-form-item label="日期">
              <!-- <j-date
                  placeholder="请选择开始日期"
                  class="query-group-cust"
                  v-model="queryParam.changeDate_begin"
                ></j-date>
                <span class="query-group-split-cust"></span>
                <j-date
                  placeholder="请选择结束日期"
                  class="query-group-cust"
                  v-model="queryParam.changeDate_end"
                ></j-date>  -->
              <a-range-picker
                style="width: 210px"
                v-model="queryParam.changeDateRange"
                format="YYYY-MM-DD"
                :placeholder="['开始时间', '结束时间']"
                @change="onDateChange"
              />
            </a-form-item>
          </a-col>
          <a-col :md="12" :sm="24">
            <a-form-item label="关键字">
              <!-- <a-input placeholder="关键字" v-model="queryParam.keyWord"></a-input> -->
               <a-input-search placeholder="关键字"   v-model="queryParam.keyWord" style="width: 200px" @search="searchQuery" />
            </a-form-item>
          </a-col> 
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->
    <!-- table区域-begin -->
    <div>
      <a-table
        ref="table"
        size="middle"
        :scroll="{ x: true }"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        class="j-table-force-nowrap"
        @change="handleTableChange"
      >
        <template slot="fileSlot" slot-scope="text, record">
          <a-icon type="tool"  @click="doHandle(record)" title="处理" />
        </template>
      </a-table>
    </div>
    <anode-change-mini-form ref="modalForm" @ok="modalFormOk"></anode-change-mini-form>
  </a-card>
</template>

<script>
import { httpAction, getAction } from '@/api/manage'
import '@/assets/less/TableExpand.less'
import moment from 'moment'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import AnodeChangeMiniForm from '@/views/corp/anodeChange/modules/AnodeChangeMiniForm'

export default {
  name: 'ReportCronJobDataList',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    AnodeChangeMiniForm,
  },
  data() {
    return {
      description: '换极提醒',
      /* 排序参数 */
      isorter: {
        column: 'changeDate',
        order: 'asc',
      },
      // 表头
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '槽号',
          align: 'center',
          dataIndex: 'slotName',
        },
        {
          title: '位置',
          align: 'center',
          dataIndex: 'position',
        },
        {
          title: '预定换极日期',
          align: 'center',
          dataIndex: 'changeDate',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
        },
        {
          title: '操作',
          align: 'center',
          dataIndex: 'fileUrl',
          scopedSlots: { customRender: 'fileSlot' },
        },
        // {
        //   title: '操作',
        //   dataIndex: 'action',
        //   align:"center",
        //   fixed:"right",
        //   width:147,
        //   scopedSlots: { customRender: 'action' }
        // }
      ],
      url: {
        list: '/anodeChangeRecord/anodeChangeRecord/list',
      },
      dictOptions: {},
      superFieldList: [],
      /* 分页参数 */
      ipagination: {
        current: 1,
        pageSize: 5,
        pageSizeOptions: ['5', '10', '20', '30'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' 共' + total + '条'
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0,
        confirmLoading: false,
      },
      // 查询参数
      queryParam: {
        status: 0,
      },
    }
  },
  created() {
    this.getSuperFieldList()
  },
  computed: {
    importExcelUrl: function () {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    },
  },
  methods: {
    initDictConfig() {},
    getSuperFieldList() {
      let fieldList = []
      fieldList.push({ type: 'string', value: 'paramId', text: '定时任务设置id', dictCode: '' })
      fieldList.push({ type: 'int', value: 'reportId', text: '报表id', dictCode: '' })
      fieldList.push({ type: 'string', value: 'reportName', text: '报表名称', dictCode: '' })
      fieldList.push({ type: 'string', value: 'fileUrl', text: '文件', dictCode: '' })
      this.superFieldList = fieldList
    },
    doHandle(record) {
      //   if (!text) {
      //     this.$message.warning('未知的文件')
      //     return
      //   }
      //   if (text.indexOf(',') > 0) {
      //     text = text.substring(0, text.indexOf(','))
      //   }
      //   let url = window._CONFIG['domianURL'] + '/sys/common/download/' + text
      //   window.open(url)
      this.$refs.modalForm.edit(record)
      this.$refs.modalForm.title = '处理'
      return
      var that = this
      this.$confirm({
        title: '确认处理',
        content: '确认处理?',
        onOk: function () {
          var param = Object.assign({}, record)
          param.status = 1
          httpAction('/anodeChangeRecord/anodeChangeRecord/edit', param, 'put')
            .then((res) => {
              if (res.success) {
                that.$message.success('操作成功')
                that.loadData()
              } else {
                that.$message.warning(res.message)
              }
            })
            .finally(() => {
              that.confirmLoading = false
            })
        },
      })
    },
    modalFormOk() {
      this.loadData()
    },
    onDateChange: function (value, dateString) {
      console.log(dateString[0], dateString[1])
      this.queryParam.changeDate_begin = dateString[0]
      this.queryParam.changeDate_end = dateString[1]
    },
  },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>